<%@ page contentType="text/html;charset=UTF-8" language="java" %><!DOCTYPE html>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>拼夕夕商城</title>

    <!-- Favicons -->
    <link rel="shortcut icon" href="${pageContext.request.contextPath}/bs/assets/images/favicon.ico">

    <!-- Vendor CSS (Icon Font) -->

    <!--
<link rel="stylesheet" href="${pageContext.request.contextPath}/bs/assets/css/vendor/fontawesome.min.css" />
<link rel="stylesheet" href="${pageContext.request.contextPath}/bs/assets/css/vendor/pe-icon-7-stroke.min.css" />
-->


    <!-- Plugins CSS (All Plugins Files) -->


    <!--
<link rel="stylesheet" href="${pageContext.request.contextPath}/bs/assets/css/plugins/swiper-bundle.min.css" />
<link rel="stylesheet" href="${pageContext.request.contextPath}/bs/assets/css/plugins/animate.min.css" />
<link rel="stylesheet" href="${pageContext.request.contextPath}/bs/assets/css/plugins/lightgallery.min.css" />
<link rel="stylesheet" href="${pageContext.request.contextPath}/bs/assets/css/plugins/aos.min.css" />
<link rel="stylesheet" href="${pageContext.request.contextPath}/bs/assets/css/plugins/nice-select.min.css" />
-->


    <!-- Main Style CSS -->
    <!-- <link rel="stylesheet" href="${pageContext.request.contextPath}/bs/assets/css/style.css" /> -->


    <!-- Use the minified version files listed below for better performance and remove the files listed above -->


    <link rel="stylesheet" href="${pageContext.request.contextPath}/bs/assets/css/vendor/vendor.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/bs/assets/css/plugins/plugins.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/bs/assets/css/style.min.css">





</head>

<body>

<!-- Header Section Start -->
<div class="header section">

    <!-- Header Top Start -->
    <div class="header-top bg-primary">
        <div class="container">
            <div class="row align-items-center">

                <!-- Header Top Message Start -->
                <div class="col-12">
                    <div class="header-top-msg-wrapper text-center">
                        <p class="header-top-message text-center"><strong>数码</strong> 系列最高可减50% <a href="shop.jsp" class="btn btn-hover-dark btn-secondary">现在购买</a></p>
                        <div class="header-top-close-btn">
                            <button class="top-close-btn"><i class="pe-7s-close"></i></button>
                        </div>
                    </div>
                </div>
                <!-- Header Top Message End -->
            </div>
        </div>
    </div>
    <!-- Header Top End -->

    <!-- Header Bottom Start -->
    <div class="header-bottom">
        <div class="header-sticky">
            <div class="container">
                <div class="row align-items-center position-relative">

                    <!-- Header Logo Start -->
                    <div class="col-md-6 col-lg-3 col-xl-2 col-6">
                        <div class="header-logo">
                            <a href="index.jsp"><img src="${pageContext.request.contextPath}/bs/assets/images/logo/logo.png" alt="Site Logo" /></a>
                        </div>
                    </div>
                    <!-- Header Logo End -->

                    <!-- Header Menu Start -->
                    <div class="col-lg-6 d-none d-lg-block">

                        <div class="main-menu">
                            <ul>
                                <li class="has-children">
                                    <a href="${pageContext.request.contextPath}/bs/index.jsp">首页</a>
                                </li>
                                <li class="has-children position-static">
                                    <a href="#">商品<i class="fa fa-angle-down"></i></a>
                                    <ul class="mega-menu row">
                                        <li class="col-3">
                                            <h4 class="mega-menu-title">购买商品</h4>
                                            <ul class="mb-n2">
                                                <li><a href="${pageContext.request.contextPath}/product/list">全部商品</a></li>
                                                <li><a href="${pageContext.request.contextPath}/product/list">服装</a></li>
                                                <li><a href="${pageContext.request.contextPath}/product/list">首饰</a></li>
                                            </ul>
                                        </li>
                                        <li class="col-3">
                                            <h4 class="mega-menu-title">特别推荐</h4>
                                            <ul class="mb-n2">
                                                <li><a href="${pageContext.request.contextPath}/bs/single-product-sale.jsp">潘多拉手链</a></li>
                                                <li><a href="${pageContext.request.contextPath}/bs/single-product-group.jsp">雷蛇皮卡丘联名</a></li>
                                                <li><a href="${pageContext.request.contextPath}/bs/single-product-slider.jsp">植村秀海贼王联名</a></li>
                                            </ul>
                                        </li>
                                        <li class="col-3">
                                            <h4 class="mega-menu-title">特别推荐</h4>
                                            <ul class="mb-n2">
                                                <li><a href="${pageContext.request.contextPath}/bs/single-product-tab-style-left.jsp">卡西欧手表</a></li>
                                                <li><a href="${pageContext.request.contextPath}/bs/single-product-tab-style-right.jsp">拍立得</a></li>
                                                <li><a href="${pageContext.request.contextPath}/bs/single-product-sticky-left.jsp">优衣库</a></li>
                                            </ul>
                                        </li>
                                        <li class="col-3">
                                            <h4 class="mega-menu-title">其他部分</h4>
                                            <ul class="mb-n2">
                                                <li><a href="${pageContext.request.contextPath}/user/userInfo">我的帐户</a></li>
                                                <li><a href="${pageContext.request.contextPath}/cart/list">购物车</a></li>
                                                <c:if test="${sessionScope.get('userSession') == null}">
                                                    <li><a href="${pageContext.request.contextPath}/bs/login.jsp">登录</a></li>
                                                    <li><a href="${pageContext.request.contextPath}/bs/register.jsp">注册</a></li>
                                                </c:if>
                                                <c:if test="${sessionScope.get('userSession') != null}">
                                                    <li><a href="${pageContext.request.contextPath}/user/loginOut">退出登录</a></li>
                                                </c:if>
                                            </ul>
                                        </li>
                                    </ul>
                                </li>

                                <li><a href="${pageContext.request.contextPath}/bs/about.jsp">关于我们</a></li>
                                <li><a href="${pageContext.request.contextPath}/bs/contact.jsp">联系我们</a></li>
                            </ul>
                        </div>

                    </div>
                    <!-- Header Menu End -->

                    <!-- Header Action Start -->
                    <div class="col-md-6 col-lg-3 col-xl-4 col-6 justify-content-end">
                        <div class="header-actions">
                            <a href="javascript:void(0)" class="header-action-btn header-action-btn-search d-none d-lg-block"><i class="pe-7s-search"></i></a>
                            <div class="dropdown-user d-none d-lg-block">
                                <a href="javascript:void(0)" class="header-action-btn"><i class="pe-7s-user"></i></a>

                            </div>
                            <a  class="header-action-btn header-action-btn-wishlist">
                                <i class="pe-7s-like"></i>
                            </a>
                            <a href="javascript:void(0)" class="header-action-btn header-action-btn-cart">
                                <i class="pe-7s-cart"></i>

                            </a>
                            <!-- Mobile Menu Hambarger Action Button Start -->
                            <a href="javascript:void(0)" class="header-action-btn header-action-btn-menu d-lg-none d-md-block">
                                <i class="fa fa-bars"></i>
                            </a>
                            <!-- Mobile Menu Hambarger Action Button End -->

                        </div>
                    </div>
                    <!-- Header Action End -->

                </div>
            </div>
        </div>
    </div>
    <!-- Header Bottom End -->

    <!-- Offcanvas Search Start -->
    <div class="offcanvas-search">
        <div class="offcanvas-search-inner">

            <!-- Button Close Start -->
            <div class="offcanvas-btn-close">
                <i class="pe-7s-close"></i>
            </div>
            <!-- Button Close End -->

            <!-- Offcanvas Search Form Start -->
            <form class="offcanvas-search-form" action="#">
                <input type="text" placeholder="Search Product..." class="offcanvas-search-input">
            </form>
            <!-- Offcanvas Search Form End -->

        </div>
    </div>
    <!-- Offcanvas Search End -->

</div>
<!-- Header Section End -->


<!-- Breadcrumb Section Start -->
<div class="section">

    <!-- Breadcrumb Area Start -->
    <div class="breadcrumb-area bg-primary">
        <div class="container">
            <div class="breadcrumb-content">
                <ul>
                    <li>
                        <a href="index.jsp"><i class="fa fa-home"></i> </a>
                    </li>
                    <li class="active"> 单一商品销售</li>
                </ul>
            </div>
        </div>
    </div>
    <!-- Breadcrumb Area End -->

</div>
<!-- Breadcrumb Section End -->

<<!-- Single Product Section Start -->
<div class="section section-margin-top">
    <div class="container">

        <div class="row">
            <div class="col-lg-6 offset-lg-0 col-md-8 offset-md-2">

                <!-- Product Details Image Start -->
                <div class="product-details-img d-flex overflow-hidden flex-row">

                    <!-- Single Product Image Start -->
                    <div class="single-product-vertical-tab swiper-container ms-0 me-2">

                        <div class="swiper-wrapper popup-gallery">
                            <a class="swiper-slide h-auto" href="${pageContext.request.contextPath}/bs/assets/images/products/large-product/16.jpg">
                                <img class="w-100" src="${pageContext.request.contextPath}/bs/assets/images/products/large-product/16.jpg" alt="Product">
                            </a>
                            <a class="swiper-slide h-auto" href="${pageContext.request.contextPath}/bs/assets/images/products/large-product/17.jpg">
                                <img class="w-100" src="${pageContext.request.contextPath}/bs/assets/images/products/large-product/17.jpg" alt="Product">
                            </a>
                            <a class="swiper-slide h-auto" href="${pageContext.request.contextPath}/bs/assets/images/products/large-product/18.jpg">
                                <img class="w-100" src="${pageContext.request.contextPath}/bs/assets/images/products/large-product/18.jpg" alt="Product">
                            </a>
                            <a class="swiper-slide h-auto" href="${pageContext.request.contextPath}/bs/assets/images/products/large-product/19.jpg">
                                <img class="w-100" src="${pageContext.request.contextPath}/bs/assets/images/products/large-product/19.jpg" alt="Product">
                            </a>
                            <a class="swiper-slide h-auto" href="${pageContext.request.contextPath}/bs/assets/images/products/large-product/20.jpg">
                                <img class="w-100" src="${pageContext.request.contextPath}/bs/assets/images/products/large-product/20.jpg" alt="Product">
                            </a>
                        </div>

                        <!-- Swiper Pagination Start -->
                        <!-- <div class="swiper-pagination d-none"></div> -->
                        <!-- Swiper Pagination End -->

                        <!-- Next Previous Button Start -->
                        <!-- <div class="swiper-product-tab-next swiper-button-next"><i class="pe-7s-angle-right"></i></div>
                            <div class="swiper-product-tab-prev swiper-button-prev"><i class="pe-7s-angle-left"></i></div> -->
                        <!-- Next Previous Button End -->

                    </div>
                    <!-- Single Product Image End -->

                    <!-- Single Product Thumb Start -->
                    <div class="product-thumb-vertical overflow-hidden swiper-container">

                        <div class="swiper-wrapper">
                            <div class="swiper-slide">
                                <img src="${pageContext.request.contextPath}/bs/assets/images/products/small-product/16.jpg" alt="Product">
                            </div>
                            <div class="swiper-slide">
                                <img src="${pageContext.request.contextPath}/bs/assets/images/products/small-product/17.jpg" alt="Product">
                            </div>
                            <div class="swiper-slide">
                                <img src="${pageContext.request.contextPath}/bs/assets/images/products/small-product/18.jpg" alt="Product">
                            </div>
                            <div class="swiper-slide">
                                <img src="${pageContext.request.contextPath}/bs/assets/images/products/small-product/19.jpg" alt="Product">
                            </div>
                            <div class="swiper-slide">
                                <img src="${pageContext.request.contextPath}/bs/assets/images/products/small-product/20.jpg" alt="Product">
                            </div>
                        </div>

                        <!-- Swiper Pagination Start -->
                        <!-- <div class="swiper-pagination d-none"></div> -->
                        <!-- Swiper Pagination End -->

                        <!-- Next Previous Button Start -->
                        <div class="swiper-button-vertical-next  swiper-button-next"><i class="pe-7s-angle-right"></i></div>
                        <div class="swiper-button-vertical-prev swiper-button-prev"><i class="pe-7s-angle-left"></i></div>
                        <!-- Next Previous Button End -->

                    </div>
                    <!-- Single Product Thumb End -->

                </div>
                <!-- Product Details Image End -->

            </div>
            <div class="col-lg-6">

                <!-- Product Summery Start -->
                <div class="product-summery position-relative">

                    <!-- Product Head Start -->
                    <div class="product-head mb-3">
                        <h2 class="product-title">拍立得</h2>
                    </div>
                    <!-- Product Head End -->

                    <!-- Rating Start -->
                    <span class="ratings justify-content-start mb-2">
                                <span class="rating-wrap">
                                    <span class="star" style="width: 100%"></span>
                        </span>
                        <span class="rating-num">(5)</span>
                        </span>
                    <!-- Rating End -->

                    <!-- Price Box Start -->
                    <div class="price-box mb-2">
                        <span class="regular-price">$390.00</span>
                        <span class="old-price"><del>$392.00</del></span>
                    </div>
                    <!-- Price Box End -->

                    <!-- SKU Start -->
                    <div class="sku mb-3">
                        <span>SKU: 12345</span>
                    </div>
                    <!-- SKU End -->

                    <!-- Product Inventory Start -->
                    <div class="product-inventroy mb-3">
                        <span class="inventroy-title"> <strong>库存:</strong></span>
                        <span class="inventory-varient">999</span>
                    </div>
                    <!-- Product Inventory End -->

                    <!-- Description Start -->
                    <p class="desc-content mb-5">富士相机mini7C 套餐含拍立得相纸 男女学生儿童款傻瓜可爱7s相机.</p>
                    <!-- Description End -->

                    <!-- Product Coler Variation Start -->
                    <div class="product-color-variation mb-5">
                        <span> <strong>颜色: </strong></span>
                        <button type="button" class="btn bg-primary"></button>
                        <button type="button" class="btn bg-dark"></button>
                    </div>
                    <!-- Product Coler Variation End -->

                    <!-- Product Size Start -->
                    <div class="product-size mb-5">
                        <span><strong>型号 :</strong></span>
                        <a href="#" class="size-ratio active">i7c</a>
                        <a href="#" class="size-ratio">min</a>
                        <a href="#" class="size-ratio">promax</a>
                    </div>
                    <!-- Product Size End -->

                    <!-- Quantity Start -->
                    <div class="quantity d-flex align-items-center mb-5">
                        <span class="me-2"><strong>数量: </strong></span>
                        <div class="cart-plus-minus">
                            <input class="cart-plus-minus-box" value="1" type="text">
                            <div class="dec qtybutton"></div>
                            <div class="inc qtybutton"></div>
                        </div>
                    </div>
                    <!-- Quantity End -->

                    <!-- Cart Button Start -->
                    <div class="cart-btn mb-4">
                        <div class="add-to_cart">
                            <a class="btn btn-dark btn-hover-primary" href="cart.jsp">添加到购物车</a>
                        </div>
                    </div>
                    <!-- Cart Button End -->

                    <!-- Action Button Start -->
                    <div class="actions border-bottom mb-4 pb-4">
                        <a  title="Compare" class="action compare"><i class="pe-7s-refresh-2"></i> 比较</a>
                        <a  title="Wishlist" class="action wishlist"><i class="pe-7s-like"></i> 愿望清单</a>
                    </div>
                    <!-- Action Button End -->

                    <!-- Social Shear Start -->
                    <div class="social-share">
                        <span><strong>Social: </strong></span>
                        <a href="#" class="facebook-color"><i class="fa fa-facebook"></i> Like</a>
                        <a href="#" class="twitter-color"><i class="fa fa-twitter"></i> Tweet</a>
                        <a href="#" class="pinterest-color"><i class="fa fa-pinterest"></i> Save</a>
                    </div>
                    <!-- Social Shear End -->

                    <!-- Payment Option Start -->
                    <div class="payment-option mt-4 d-flex">
                        <span><strong>付款: </strong></span>
                        <a href="#">
                            <img class="fit-image ms-1" src="${pageContext.request.contextPath}/bs/assets/images/payment/payment.png" alt="Payment Option Image">
                        </a>
                    </div>
                    <!-- Payment Option End -->

                    <!-- Product Delivery Policy Start -->
                    <ul class="product-delivery-policy border-top pt-4 mt-4 border-bottom pb-4">
                        <li> <i class="fa fa-check-square"></i> <span>安全策略（使用客户保证模块编辑）</span></li>
                        <li><i class="fa fa-truck"></i><span>交付策略（使用客户保证模块编辑）</span></li>
                        <li><i class="fa fa-refresh"></i><span>退货策略（使用客户保证模块编辑）</span></li>
                    </ul>
                    <!-- Product Delivery Policy End -->

                </div>
                <!-- Product Summery End -->

            </div>
        </div>
        <div class="row section-margin">
            <!-- Single Product Tab Start -->
            <div class="col-lg-12 col-custom single-product-tab">
                <ul class="nav nav-tabs" id="myTab" role="tablist">
                    <li class="nav-item">
                        <a class="nav-link active" id="home-tab" data-bs-toggle="tab" href="#connect-1" role="tab" aria-selected="true">说明</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" id="profile-tab" data-bs-toggle="tab" href="#connect-2" role="tab" aria-selected="false">评论</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" id="contact-tab" data-bs-toggle="tab" href="#connect-3" role="tab" aria-selected="false">运输政策</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" id="review-tab" data-bs-toggle="tab" href="#connect-4" role="tab" aria-selected="false">尺码表</a>
                    </li>
                </ul>
                <div class="tab-content mb-text" id="myTabContent">
                    <div class="tab-pane fade show active" id="connect-1" role="tabpanel" aria-labelledby="home-tab">
                        <div class="desc-content p-3">
                            <p class="mb-3">另一方面，我们义愤填膺地谴责和厌恶那些被当下欢乐的魅力所迷惑和挫败的人，他们被欲望所蒙蔽，无法预见必然会发生的痛苦和麻烦；同样的责任属于那些因意志薄弱而失职的人，这与因劳苦而畏缩的人是一样的。这些案例非常简单，易于区分。在一个自由的时间里，当我们的选择权不受束缚，当没有什么阻止我们做我们最喜欢的事情时，每一种快乐都会受到欢迎，每一种痛苦都会避免。但在某些情况下，由于责任或商业义务的要求，常常会出现拒绝快乐，接受烦恼的情况。因此，智者在这些问题上总是坚持这个选择原则：他拒绝快乐以获得其他更大的快乐，否则他忍受痛苦以避免更大的痛苦。</p>
                            <p>这真的很容易做到，让我们有所作为。作为一个孩子，当我们孤独的时候，我们必须选择一个选择，当没有什么阻止我们做最好的事情的时候，所有的欲望必须被带走，所有的痛苦必须被击退。但在需要的时候，或服务，或必需品，往往发生，使志愿者可能被认为，而麻烦可能不会得到缓解。因此，它是由明智的高兴的事情，因此，如果它回来了，它将由更多的志愿者或惩罚更多的悲痛。</p>
                        </div>
                    </div>
                    <div class="tab-pane fade" id="connect-2" role="tabpanel" aria-labelledby="profile-tab">
                        <!-- Start Single Content -->
                        <div class="product_tab_content border p-3">
                            <!-- Start Single Review -->
                            <div class="single-review d-flex mb-4">

                                <!-- Review Thumb Start -->
                                <div class="review_thumb">
                                    <img alt="review images" src="${pageContext.request.contextPath}/bs/assets/images/review/1.jpg">
                                </div>
                                <!-- Review Thumb End -->

                                <!-- Review Details Start -->
                                <div class="review_details">
                                    <div class="review_info mb-2">

                                        <!-- Rating Start -->
                                        <span class="ratings justify-content-start mb-3">
                                                    <span class="rating-wrap">
                                                        <span class="star" style="width: 100%"></span>
                                            </span>
                                            <span class="rating-num">(1)</span>
                                            </span>
                                        <!-- Rating End -->

                                        <!-- Review Title & Date Start -->
                                        <div class="review-title-date d-flex">
                                            <h5 class="title">管理者 - </h5><span> January 19, 2021</span>
                                        </div>
                                        <!-- Review Title & Date End -->

                                    </div>
                                    <p>如果他在受苦，他会被认为是在帮助他。在生活的世界里，生命是弧线的支柱。我们害怕两件事，但是我们在移动，我们总是自由的。死者是活的山谷，一些兰花聚集在一起。我完全恨他。我舞得像头狮子。静脉曲张的日子过得很愉快</p>
                                </div>
                                <!-- Review Details End -->

                            </div>
                            <!-- End Single Review -->

                            <!-- Rating Wrap Start -->
                            <div class="rating_wrap">
                                <h5 class="rating-title mb-2">添加评论</h5>
                                <p class="mb-2">您的电子邮件地址将不会发布。已标记必填字段*</p>
                                <h6 class="rating-sub-title mb-2">你的评级</h6>

                                <!-- Rating Start -->
                                <span class="ratings justify-content-start mb-3">
                                            <span class="rating-wrap">
                                                <span class="star" style="width: 100%"></span>
                                    </span>
                                    <span class="rating-num">(2)</span>
                                    </span>
                                <!-- Rating End -->

                            </div>
                            <!-- Rating Wrap End -->

                            <!-- Comments ans Replay Start -->
                            <div class="comments-area comments-reply-area">
                                <div class="row">
                                    <div class="col-lg-12 col-custom">

                                        <!-- Comment form Start -->
                                        <form action="#" class="comment-form-area">
                                            <div class="row comment-input">

                                                <!-- Input Name Start -->
                                                <div class="col-md-6 col-custom comment-form-author mb-3">
                                                    <label>名字 <span class="required">*</span></label>
                                                    <input type="text" required="required" name="Name">
                                                </div>
                                                <!-- Input Name End -->

                                                <!-- Input Email Start -->
                                                <div class="col-md-6 col-custom comment-form-emai mb-3">
                                                    <label>邮箱<span class="required">*</span></label>
                                                    <input type="text" required="required" name="email">
                                                </div>
                                                <!-- Input Email End -->

                                            </div>
                                            <!-- Comment Texarea Start -->
                                            <div class="comment-form-comment mb-3">
                                                <label>评论</label>
                                                <textarea class="comment-notes" required="required"></textarea>
                                            </div>
                                            <!-- Comment Texarea End -->

                                            <!-- Comment Submit Button Start -->
                                            <div class="comment-form-submit">
                                                <button class="btn btn-dark btn-hover-primary">提交</button>
                                            </div>
                                            <!-- Comment Submit Button End -->

                                        </form>
                                        <!-- Comment form End -->

                                    </div>
                                </div>
                            </div>
                            <!-- Comments ans Replay End -->

                        </div>
                        <!-- End Single Content -->
                    </div>
                    <div class="tab-pane fade" id="connect-3" role="tabpanel" aria-labelledby="contact-tab">
                        <!-- Shipping Policy Start -->
                        <div class="shipping-policy mb-n2 p-3">
                            <h4 class="title-3 mb-4">我们商店的运输政策</h4>
                            <p class="desc-content mb-2">也许他很痛苦，他认为自己身体很好，但他被迫忍受九次痛苦。因为我到了最不聪明的人那里，他从任何人那里得到我们军队的讲演，他都不愿意听。但如果有两三个人遭受同样的痛苦，他们也会受到同样的伤害。</p>
                            <ul class="policy-list mb-2">
                                <li>1-2个工作日（通常在一天结束时）</li>
                                <li><a href="#">30天退款担保</a></li>
                                <li>24/7现场支持</li>
                                <li>我讨厌被敲诈。</li>
                                <li>奥古斯·杜伊斯·多洛尔</li>
                                <li>你知道什么都不容易。</li>
                            </ul>
                            <p class="desc-content mb-2">因为当我们选择这个选项时，我们不能给主人带来任何快乐。类型没有白费的光；它是给那些读过它的人的，直到最后他们才可以做它。</p>
                            <p class="desc-content mb-2">学生们教我如何读他们以前读过的课。众所周知，动态过程是随着讲课内容的变化而变化的。令人惊奇的是，在书写人类形态之前，我们现在认为是清楚的哥特式字母。</p>
                            <p class="desc-content mb-2">四号到十五号。同样地，我们这些现在看不到光明的人将来也会孤独。</p>
                        </div>
                        <!-- Shipping Policy End -->
                    </div>
                    <div class="tab-pane fade" id="connect-4" role="tabpanel" aria-labelledby="review-tab">
                        <div class="size-tab table-responsive-lg p-3">
                            <h4 class="title-3 mb-4">尺码表</h4>
                            <table class="table border mb-0">
                                <tbody>
                                <tr>
                                    <td class="cun-name"><span>UK</span></td>
                                    <td>18</td>
                                    <td>20</td>
                                    <td>22</td>
                                    <td>24</td>
                                    <td>26</td>
                                </tr>
                                <tr>
                                    <td class="cun-name"><span>European</span></td>
                                    <td>46</td>
                                    <td>48</td>
                                    <td>50</td>
                                    <td>52</td>
                                    <td>54</td>
                                </tr>
                                <tr>
                                    <td class="cun-name"><span>usa</span></td>
                                    <td>14</td>
                                    <td>16</td>
                                    <td>18</td>
                                    <td>20</td>
                                    <td>22</td>
                                </tr>
                                <tr>
                                    <td class="cun-name"><span>Australia</span></td>
                                    <td>28</td>
                                    <td>10</td>
                                    <td>12</td>
                                    <td>14</td>
                                    <td>16</td>
                                </tr>
                                <tr>
                                    <td class="cun-name"><span>Canada</span></td>
                                    <td>24</td>
                                    <td>18</td>
                                    <td>14</td>
                                    <td>42</td>
                                    <td>36</td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
            <!-- Single Product Tab End -->
        </div>

    </div>
</div>
<!-- Single Product Section End -->


<!-- Footer Section Start -->
<footer class="section footer-section">
    <!-- Footer Top Start -->
    <div class="footer-top bg-primary section-padding">
        <div class="container">
            <div class="row mb-n8">
                <div class="col-12 col-sm-6 col-lg-3 mb-8">
                    <div class="single-footer-widget">
                        <h1 class="widget-title">关于我们</h1>
                        <p class="desc-content">我们是一个设计和开发团队，创造高品质的wordpress，shopify，Opencart</p>
                        <!-- Soclial Link Start -->
                        <div class="widget-social justify-content-start mb-n2">
                            <a title="Facebook" href="#"><i class="fa fa-facebook-f"></i></a>
                            <a title="Twitter" href="#"><i class="fa fa-twitter"></i></a>
                            <a title="Linkedin" href="#"><i class="fa fa-linkedin"></i></a>
                            <a title="Youtube" href="#"><i class="fa fa-youtube"></i></a>
                            <a title="Vimeo" href="#"><i class="fa fa-vimeo"></i></a>
                        </div>
                        <!-- Social Link End -->
                    </div>
                </div>
                <div class="col-12 col-sm-6 col-lg-3 mb-8">
                    <div class="single-footer-widget">
                        <h2 class="widget-title">联系我们</h2>
                        <ul class="contact-links">
                            <li><i class="pe-7s-home"></i> <span>黑龙江大庆市八一农垦大学</span> </li>
                            <li><i class="pe-7s-mail"></i><a href="mailto:info@example.com"> 2271000769@qq.com</a></li>
                            <li><i class="pe-7s-call"></i><a href="tel:+012-3456-789"> +012 3456 789</a></li>
                        </ul>
                    </div>
                </div>
                <div class="col-12 col-sm-6 col-lg-3 mb-8">
                    <div class="single-footer-widget aos-init aos-animate">
                        <h2 class="widget-title">问询处</h2>
                        <ul class="widget-list">
                            <li><a href="contact.jsp">条款与条件</a></li>
                            <li><a href="contact.jsp">付款方式</a></li>
                            <li><a href="contact.jsp">产品保修</a></li>
                            <li><a href="contact.jsp">退货流程</a></li>
                            <li><a href="contact.jsp">支付保证金</a></li>
                        </ul>
                    </div>
                </div>
                <div class="col-12 col-sm-6 col-lg-3 mb-8">
                    <div class="single-footer-widget">
                        <h2 class="widget-title">注册新闻稿</h2>
                        <div class="widget-body">
                            <!-- Newsletter Form Start -->
                            <div class="newsletter-form-wrap pt-1">
                                <form id="mc-form" class="mc-form">
                                    <input type="email" id="mc-email" class="form-control email-box mb-4" placeholder="demo@example.com" name="EMAIL">
                                    <button id="mc-submit" class="newsletter-btn" type="submit">订阅</button>
                                </form>
                                <!-- mailchimp-alerts Start -->
                                <div class="mailchimp-alerts text-centre">
                                    <div class="mailchimp-submitting"></div><!-- mailchimp-submitting end -->
                                    <div class="mailchimp-success text-success"></div><!-- mailchimp-success end -->
                                    <div class="mailchimp-error text-danger"></div><!-- mailchimp-error end -->
                                </div>
                                <!-- mailchimp-alerts end -->
                            </div>
                            <!-- Newsletter Form End -->
                            <p class="desc-content mb-0">加入1000多人的行列，他们可以在每次发布时自动获得免费和新鲜的内容</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Footer Top End -->


    <!-- Modal Start  -->
    <div class="modalquickview modal fade" id="quick-view" tabindex="-1" aria-labelledby="quick-view" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content">
                <button class="btn close" data-bs-dismiss="modal">×</button>
                <div class="row">
                    <div class="col-md-6 col-12">

                        <!-- Product Details Image Start -->
                        <div class="modal-product-carousel">

                            <!-- Single Product Image Start -->
                            <div class="swiper-container">
                                <div class="swiper-wrapper">
                                    <a class="swiper-slide" href="#">
                                        <img class="w-100" src="${pageContext.request.contextPath}/bs/assets/images/products/large-product/1.jpg" alt="Product">
                                    </a>
                                    <a class="swiper-slide" href="#">
                                        <img class="w-100" src="${pageContext.request.contextPath}/bs/assets/images/products/large-product/2.jpg" alt="Product">
                                    </a>
                                    <a class="swiper-slide" href="#">
                                        <img class="w-100" src="${pageContext.request.contextPath}/bs/assets/images/products/large-product/3.jpg" alt="Product">
                                    </a>
                                    <a class="swiper-slide" href="#">
                                        <img class="w-100" src="${pageContext.request.contextPath}/bs/assets/images/products/large-product/4.jpg" alt="Product">
                                    </a>
                                    <a class="swiper-slide" href="#">
                                        <img class="w-100" src="${pageContext.request.contextPath}/bs/assets/images/products/large-product/5.jpg" alt="Product">
                                    </a>
                                </div>

                                <!-- Swiper Pagination Start -->
                                <!-- <div class="swiper-pagination d-md-none"></div> -->
                                <!-- Swiper Pagination End -->

                                <!-- Next Previous Button Start -->
                                <div class="swiper-product-button-next swiper-button-next"><i class="pe-7s-angle-right"></i></div>
                                <div class="swiper-product-button-prev swiper-button-prev"><i class="pe-7s-angle-left"></i></div>
                                <!-- Next Previous Button End -->
                            </div>
                            <!-- Single Product Image End -->

                        </div>
                        <!-- Product Details Image End -->

                    </div>
                    <div class="col-md-6 col-12 overflow-hidden position-relative">

                        <!-- Product Summery Start -->
                        <div class="product-summery position-relative">

                            <!-- Product Head Start -->
                            <div class="product-head mb-3">
                                <h2 class="product-title">Sample product title</h2>
                            </div>
                            <!-- Product Head End -->

                            <!-- Rating Start -->
                            <span class="ratings justify-content-start mb-2">
                            <span class="rating-wrap">
                                <span class="star" style="width: 100%"></span>
                            </span>
                            <span class="rating-num">(4)</span>
                            </span>
                            <!-- Rating End -->

                            <!-- Price Box Start -->
                            <div class="price-box mb-2">
                                <span class="regular-price">$80.00</span>
                                <span class="old-price"><del>$90.00</del></span>
                            </div>
                            <!-- Price Box End -->

                            <!-- Description Start -->
                            <p class="desc-content mb-5">I must explain to you how all this mistaken idea of denouncing pleasure and praising pain was born and I will give you a complete account of the system, and expound the actual teachings of the great explorer of the truth, the master-builder of human happiness.</p>
                            <!-- Description End -->

                            <!-- Quantity Start -->
                            <div class="quantity d-flex align-items-center mb-5">
                                <span class="me-2"><strong>Qty: </strong></span>
                                <div class="cart-plus-minus">
                                    <input class="cart-plus-minus-box" value="1" type="text">
                                    <div class="dec qtybutton"></div>
                                    <div class="inc qtybutton"></div>
                                </div>
                            </div>
                            <!-- Quantity End -->

                            <!-- Cart Button Start -->
                            <div class="cart-btn mb-4">
                                <div class="add-to_cart">
                                    <a class="btn btn-dark btn-hover-primary" href="cart.jsp">Add to cart</a>
                                </div>
                            </div>
                            <!-- Cart Button End -->

                            <!-- Action Button Start -->
                            <div class="actions border-bottom mb-4 pb-4">
                                <a href="compare.jsp" title="Compare" class="action compare"><i class="pe-7s-refresh-2"></i> Compare</a>
                                <a href="wishlist.jsp" title="Wishlist" class="action wishlist"><i class="pe-7s-like"></i> Wishlist</a>
                            </div>
                            <!-- Action Button End -->

                            <!-- Social Shear Start -->
                            <div class="social-share">
                                <span><strong>Social: </strong></span>
                                <a href="#" class="facebook-color"><i class="fa fa-facebook"></i> Like</a>
                                <a href="#" class="twitter-color"><i class="fa fa-twitter"></i> Tweet</a>
                                <a href="#" class="pinterest-color"><i class="fa fa-pinterest"></i> Save</a>
                            </div>
                            <!-- Social Shear End -->

                            <!-- Payment Option Start -->
                            <div class="payment-option mt-4 d-flex">
                                <span><strong>Payment: </strong></span>
                                <a href="#">
                                    <img class="fit-image ms-1" src="${pageContext.request.contextPath}/bs/assets/images/payment/payment.png" alt="Payment Option Image">
                                </a>
                            </div>
                            <!-- Payment Option End -->

                            <!-- Product Delivery Policy Start -->
                            <ul class="product-delivery-policy border-top pt-4 mt-4 border-bottom pb-4">
                                <li> <i class="fa fa-check-square"></i> <span>Security Policy (Edit With Customer Reassurance Module)</span></li>
                                <li><i class="fa fa-truck"></i><span>Delivery Policy (Edit With Customer Reassurance Module)</span></li>
                                <li><i class="fa fa-refresh"></i><span>Return Policy (Edit With Customer Reassurance Module)</span></li>
                            </ul>
                            <!-- Product Delivery Policy End -->

                        </div>
                        <!-- Product Summery End -->

                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Modal End  -->

    <a href="#" class="scroll-top show" id="scroll-top">
        <i class="arrow-top pe-7s-angle-up-circle"></i>
        <i class="arrow-bottom pe-7s-angle-up-circle"></i>
    </a>

    <!-- Mobile Menu Start -->
    <div class="mobile-menu-wrapper">
        <div class="offcanvas-overlay"></div>

        <!-- Mobile Menu Inner Start -->
        <div class="mobile-menu-inner">

            <!-- Button Close Start -->
            <div class="offcanvas-btn-close">
                <i class="pe-7s-close"></i>
            </div>
            <!-- Button Close End -->

            <!-- Mobile Menu Inner Wrapper Start -->
            <div class="mobile-menu-inner-wrapper">
                <!-- Mobile Menu Search Box Start -->
                <div class="search-box-offcanvas">
                    <form>
                        <input class="search-input-offcanvas" type="text" placeholder="Search product...">
                        <button class="search-btn"><i class="pe-7s-search"></i></button>
                    </form>
                </div>
                <!-- Mobile Menu Search Box End -->

                <!-- Mobile Menu Start -->
                <div class="mobile-navigation">
                    <nav>
                        <ul class="mobile-menu">
                            <li class="has-children">
                                <a href="#">Home <i class="fa fa-angle-down"></i></a>
                                <ul class="dropdown">
                                    <li><a href="index.jsp">Home One</a></li>
                                    <li><a href="index-2.jsp">Home Two</a></li>
                                    <li><a href="index-3.jsp">Home Three</a></li>
                                </ul>
                            </li>
                            <li class="has-children">
                                <a href="#">Shop <i class="fa fa-angle-down" aria-hidden="true"></i></a>
                                <ul class="dropdown">
                                    <li><a href="shop.jsp">Shop Grid</a></li>
                                    <li><a href="shop-left-sidebar.jsp">Shop Left Sidebar</a></li>
                                    <li><a href="shop-right-sidebar.jsp">Shop Right Sidebar</a></li>
                                    <li><a href="shop-list-fullwidth.jsp">Shop List Fullwidth</a></li>
                                    <li><a href="shop-list-left-sidebar.jsp">Shop List Left Sidebar</a></li>
                                    <li><a href="shop-list-right-sidebar.jsp">Shop List Right Sidebar</a></li>
                                    <li><a href="wishlist.jsp">Wishlist</a></li>
                                    <li><a href="cart.jsp">Shopping Cart</a></li>
                                    <li><a href="checkout.jsp">Checkout</a></li>
                                    <li><a href="compare.jsp">Compare</a></li>
                                </ul>
                            </li>
                            <li class="has-children">
                                <a href="#">Product <i class="fa fa-angle-down" aria-hidden="true"></i></a>
                                <ul class="dropdown">
                                    <li><a href="single-product.jsp">Single Product</a></li>
                                    <li><a href="single-product-sale.jsp">Single Product Sale</a></li>
                                    <li><a href="single-product-group.jsp">Single Product Group</a></li>
                                    <li><a href="single-product-normal.jsp">Single Product Normal</a></li>
                                    <li><a href="single-product-affiliate.jsp">Single Product Affiliate</a></li>
                                    <li><a href="single-product-slider.jsp">Single Product Slider</a></li>
                                    <li><a href="single-product-gallery-left.jsp">Gallery Left</a></li>
                                    <li><a href="single-product-gallery-right.jsp">Gallery Right</a></li>
                                    <li><a href="single-product-tab-style-left.jsp">Tab Style Left</a></li>
                                    <li><a href="single-product-tab-style-right.jsp">Tab Style Right</a></li>
                                    <li><a href="single-product-sticky-left.jsp">Sticky Left</a></li>
                                    <li><a href="single-product-sticky-right.jsp">Sticky Right</a></li>
                                </ul>
                            </li>
                            <li class="has-children">
                                <a href="#">Pages <i class="fa fa-angle-down" aria-hidden="true"></i></a>
                                <ul class="dropdown">
                                    <li><a href="about.jsp">About Us</a></li>
                                    <li><a href="contact.jsp">Contact</a></li>
                                    <li><a href="faq.jsp">Faq</a></li>
                                    <li><a href="error-404.jsp">Error 404</a></li>
                                    <li><a href="${pageContext.request.contextPath}/user/userInfo">My Account</a></li>
                                    <li><a href="login.jsp">Loging | Register</a></li>
                                </ul>
                            </li>
                            <li class="has-children">
                                <a href="#">Blog <i class="fa fa-angle-down" aria-hidden="true"></i></a>
                                <ul class="dropdown">
                                    <li><a href="blog.jsp">Blog</a></li>
                                    <li><a href="blog-left-sidebar.jsp">Blog Left Sidebar</a></li>
                                    <li><a href="blog-right-sidebar.jsp">Blog Right Sidebar</a></li>
                                    <li><a href="blog-details.jsp">Blog Details</a></li>
                                    <li><a href="blog-details-sidebar.jsp">Blog Details Sidebar</a></li>
                                </ul>
                            </li>
                            <li><a href="about.jsp">About</a></li>
                            <li><a href="contact.jsp">Contact</a></li>
                        </ul>
                    </nav>
                </div>
                <!-- Mobile Menu End -->

                <!-- Language, Currency & Link Start -->
                <div class="offcanvas-lag-curr mb-6">
                    <div class="header-top-lan-curr-link">
                        <div class="header-top-lan dropdown">
                            <h4 class="title">Language:</h4>
                            <button class="dropdown-toggle" data-bs-toggle="dropdown">English <i class="fa fa-angle-down"></i></button>
                            <ul class="dropdown-menu dropdown-menu-right">
                                <li><a class="dropdown-item" href="#">English</a></li>
                                <li><a class="dropdown-item" href="#">Japanese</a></li>
                                <li><a class="dropdown-item" href="#">Arabic</a></li>
                                <li><a class="dropdown-item" href="#">Romanian</a></li>
                            </ul>
                        </div>
                        <div class="header-top-curr dropdown">
                            <h4 class="title">Currency:</h4>
                            <button class="dropdown-toggle" data-bs-toggle="dropdown">USD <i class="fa fa-angle-down"></i></button>
                            <ul class="dropdown-menu dropdown-menu-right">
                                <li><a class="dropdown-item" href="#">USD</a></li>
                                <li><a class="dropdown-item" href="#">Pound</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
                <!-- Language, Currency & Link End -->

                <!-- Contact Links/Social Links Start -->
                <div class="mt-auto bottom-0">

                    <!-- Contact Links Start -->
                    <ul class="contact-links">
                        <li><i class="fa fa-phone"></i><a href="#"> +012 3456 789</a></li>
                        <li><i class="fa fa-envelope-o"></i><a href="#"> info@example.com</a></li>
                        <li><i class="fa fa-clock-o"></i> <span>Monday - Sunday 9.00 - 18.00</span> </li>
                    </ul>
                    <!-- Contact Links End -->

                    <!-- Social Widget Start -->
                    <div class="widget-social">
                        <a title="Facebook" href="#"><i class="fa fa-facebook-f"></i></a>
                        <a title="Twitter" href="#"><i class="fa fa-twitter"></i></a>
                        <a title="Linkedin" href="#"><i class="fa fa-linkedin"></i></a>
                        <a title="Youtube" href="#"><i class="fa fa-youtube"></i></a>
                        <a title="Vimeo" href="#"><i class="fa fa-vimeo"></i></a>
                    </div>
                    <!-- Social Widget Ende -->
                </div>
                <!-- Contact Links/Social Links End -->
            </div>
            <!-- Mobile Menu Inner Wrapper End -->

        </div>
        <!-- Mobile Menu Inner End -->
    </div>
    <!-- Mobile Menu End -->

    <!-- Scripts -->
    <!-- Global Vendor, plugins JS -->

    <!-- Vendor JS -->

    <!-- 
    <script src="${pageContext.request.contextPath}/bs/assets/js/vendor/popper.min.js"></script>
    <script src="${pageContext.request.contextPath}/bs/assets/js/vendor/bootstrap.min.js"></script>
    <script src="${pageContext.request.contextPath}/bs/assets/js/vendor/jquery-3.5.1.min.js"></script>
    <script src="${pageContext.request.contextPath}/bs/assets/js/vendor/jquery-migrate-3.3.0.min.js"></script>
    <script src="${pageContext.request.contextPath}/bs/assets/js/vendor/modernizr-3.11.2.min.js"></script>
    -->


    <!-- Plugins JS -->

    <!-- 
    <script src="${pageContext.request.contextPath}/bs/assets/js/plugins/aos.min.js"></script>
    <script src="${pageContext.request.contextPath}/bs/assets/js/plugins/jquery.ajaxchimp.min.js"></script>
    <script src="${pageContext.request.contextPath}/bs/assets/js/plugins/jquery-ui.min.js"></script>
    <script src="${pageContext.request.contextPath}/bs/assets/js/plugins/nice-select.min.js"></script>
    <script src="${pageContext.request.contextPath}/bs/assets/js/plugins/swiper-bundle.min.js"></script>
    <script src="${pageContext.request.contextPath}/bs/assets/js/plugins/countdown.min.js"></script>
    <script src="${pageContext.request.contextPath}/bs/assets/js/plugins/lightgallery-all.min.js"></script>
    -->


    <!-- Use the minified version files listed below for better performance and remove the files listed above -->


    <script src="${pageContext.request.contextPath}/bs/assets/js/vendor.min.js"></script>
    <script src="${pageContext.request.contextPath}/bs/assets/js/plugins.min.js"></script>

    <!--Main JS-->
    <script src="${pageContext.request.contextPath}/bs/assets/js/main.js"></script>
</body>

</html>